<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:c="http://java.sun.com/jsp/jstl/core"
      xmlns:p="http://primefaces.org/ui">
    <h:head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
        <link rel="shortcut icon" href="images/logo W.jpg" />
        <title>Work to Worker</title>
        <style>
            a:link {text-decoration:none;}
            #menudiv2:hover{background-color: #FF6600;color: #1A3665}
        </style>
        <style type="text/css">
            @font-face {
                font-family: "jokerman";
                src: url('font/VIVALDII.TTF') format("truetype");
            }  
            @media screen and (-webkit-min-device-pixel-ratio:0)
            { 
                #fix1 { margin-top: 0px } 
                #fix2 { margin-top: 15px }
                #check{margin-top: 15px}
                #fullname{margin-top: 2px}
                #age, #gender, #ident, #dateIs, #address, #country, #phone {margin-top: 21px}
                #birth, #province{margin-top: 19px}
                #placeIs{margin-top: 20px}
                #email{margin-top: 21px}
            }
            @-moz-document url-prefix()
            {
                #fix1 { margin-top: -20px }
            #check,#birth, #province{margin-top: 20px}
            #age, #gender, #ident, #dateIs, #address, #country, #phone {margin-top: 21px}

            #placeIs{margin-top: 22px}
            #email{margin-top: 24px}
            }
        </style>
     
<!--        <script>
            var i =0;
            $(document).ready(function(){
                $("#toggle").click(function(){
                    if(i%2==0){
                        $("#info").show("slow");       
                        document.getElementById("toggle").innerHTML = "Hide"
                    }
                    else{
                        $("#info").hide("slow");    
                        document.getElementById("toggle").innerHTML = "View"
                    }
                    i++;
                });
            });
        </script>-->
    </h:head>
    <h:body style="background-color:  #1A3665">
        <f:view locale="#{languageBean.locale}">
             <h:form>
            <div style="width: 1000px;margin: auto;margin-top: 20px;background-color: white;border-radius: 10px;-moz-border-radius: 10px">
                <ui:include src="headertemplate1.xhtml" />            
                <div>
                    <ul style="width: 700px;;margin-left: 100px;margin-top: 50px">
                        <h:form>
                            <li style="list-style: none;background-color: #00C2F3;color: white;font-weight: bold;padding: 5px 0px 5px 30px;font-size: 20px;border-top-right-radius: 10px;border-top-left-radius: 10px;-moz-border-top-left-radius: 10px;-moz-border-top-right-radius: 10px">
                                Your Information
                            </li>
                            <li style="list-style: none;border: 1px #00C2F3 solid;">                        
                                <div style="margin-left: -30px;margin-top: 30px;" id="info">
                                    <ul>
                                        <li style="display: inline-block;vertical-align: top;text-align: right;width: 200px;font-weight: bold;">
                                            <ul>
                                                <li style="list-style: none;">Full name :<font style="color: red"> *</font></li>                                    
                                                <li style="list-style: none;margin-top: 20px" >Gender :<font style="color: red"> *</font></li>
                                                <li style="list-style: none;margin-top: 20px">Phone :<font style="color: red"> *</font></li>
                                                <li style="list-style: none;margin-top: 20px">Address :<font style="color: red"> *</font></li>
                                                <li style="list-style: none;margin-top: 20px">Email :<font style="color: red"> *</font></li>

                                            </ul>
                                        </li>
                                        <li style="display: inline-block;vertical-align: top;margin-left: -15px">
                                            <ul>
                                                <li style="list-style: none;"><h:outputText value="#{workerProfile.worker.name}" /></li>                                    
                                            </ul>
                                            <ul>
                                                <li style="list-style: none;margin-top: 20px"><h:outputText value="#{workerProfile.gender_temp}" /></li>                                    
                                            </ul>
                                            <ul>
                                                <li style="list-style: none;margin-top: 20px" ><h:outputText value="#{workerProfile.worker.phone}"/></li>
                                                <li style="list-style: none;margin-top: 20px" ><h:outputText value="#{workerProfile.worker.address}" /></li>
                                                <li style="list-style: none;margin-top: 20px" ><h:outputText value="#{workerProfile.worker.email}"/></li>
                                            </ul>
                                        </li>
                                        <li style="display: inline-block;vertical-align: top;margin-left: 100px">
                                            <img src="images/PhotoShare.png" width="120" height="150" alt="PhotoShare"/>
                                        </li>
                                    </ul>     
                                </div>                               
                                <br/>
                            </li>  
                        </h:form>
                    </ul>
                    <ul style="width: 700px;;margin-left: 100px;margin-top: 50px">
                        <li style="list-style: none;background-color: #00C2F3;color: white;font-weight: bold;padding: 5px 0px 5px 30px;font-size: 20px;border-top-right-radius: 10px;border-top-left-radius: 10px;-moz-border-top-left-radius: 10px;-moz-border-top-right-radius: 10px">
                            Your Resume
                        </li>
                        <li style="list-style: none;border: 1px #00C2F3 solid;padding-top: 20px">
                            <ui:repeat value="#{workerProfile.listCv}" var="c">                               
                                     <p:growl id="growl" showDetail="true" sticky="true" />
                                    <ul style="margin-top: 5px">
                                        <li style="display: inline-block;width: 400px">
                                            <h:link value="#{c.title}" outcome="workerCVDetail" style="color: black;font-weight: bold">
                                                <f:param name="idCVDetail" value="#{c.id}" />
                                            </h:link>
                                        </li>
                                        <li style="display: inline-block;text-align: right">
                                            <ul>
                                                <li style="display: inline">
                                                    <h:link value="View" outcome="workerCVDetail" style="color: #FF6600;text-decoration: underline">
                                                        <f:param name="idCVDetail" value="#{c.id}" />
                                                    </h:link>
                                                </li>                                            
                                                <li style="display: inline;margin-left: 10px">
                                                    <h:commandButton action="#{applyCVBean.aplyAction(c.id)}" value="Apply" style="color: #FF6600;text-decoration: underline;border: none;background-color: white;cursor: pointer">
                                                    </h:commandButton>
                                                </li>
                                            
                                            </ul>
                                        </li>
                                    </ul>

                                    <br/>
                               
                            </ui:repeat>
                        </li>
                    </ul>                  
                </div>
                <br/>
                <br/>
            </div>
            <div style="color: white; height: 100px;border-radius: 10px;-moz-border-radius: 10px;border: 1px;border-style: solid;border-color: white;margin-top: 20px">
                <div style="text-align: right; padding-top: 20px;padding-right: 30px">
                    Copyright © by Group 1
                    <br />
                    Project Name : Work to Worker
                    <br />
                    Member in Group : Mr Bùi Hồng Hải , Mr Nguyễn Văn Cường , Mr Nguyễn Nhất Linh , Mr Lưu Thế Thông , Mr Trần Trung Hiếu
                </div>
            </div>
             </h:form>
        </f:view>
    </h:body>
</html>

